import Vue from "vue";
import VueRouter, { RouteConfig } from "vue-router";
import Home from "@/views/Home.vue";

Vue.use(VueRouter);

const routes: Array<RouteConfig> = [
  {
    path: "/home",
    name: "Home",
    component: Home,
    beforeEnter: (to, from, next) => {
      console.log(from === VueRouter.START_LOCATION);
      next();
    },
  },
  {
    path: "/about",
    name: "About",
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () =>
      import(
        // Webpack 内联注释：指定 Chunk 名称；指定对该 Chunk 开启 prefetch
        /* webpackChunkName: "about" */
        /* webpackPrefetch: true */
        "../views/About.vue"
      ),
  },
  {
    path: "/vuex",
    name: "Vuex",
    component: () => import("../views/Vuex.vue"),
  },
];

const router = new VueRouter({
  routes,
});

const cancel = router.beforeEach((to, from, next) => {
  console.log("this is beforeEach");
  console.log(to, from);
  next();
});

router.afterEach((to, from) => {
  console.log("this is afterEach");
  console.log(to, from);
});

cancel();

console.log(router.getRoutes());

export default router;
